<template>
    <div>

    </div>
</template>

<script>
import {defineComponent} from 'vue'
import dateUtil from '@/utils/dateUtil';

export default defineComponent({
    name: "Comment",
    data() {
        return {
            dialogVisible_delete: false,        // 删除按钮弹出框
            dialogVisible_deleteSelect: false,  // 选中删除按钮弹出框
            searchContent: '',
            searchUsername: '',
            searchUserId: '',
            searchProductName: '',
            searchProductId: '',
            searchCreateTime: '',
            searchStartTime: '',
            searchEndTime: '',

            commentList: [],
            commentDelete: {},             // 存储被删除评论的id
            commentDeletes: [],                 // 存储被选中评论的id

            userRestaurants: [],            // 存储所有所有用户
            productRestaurants: [],          // 存储所有所有商品名称

            // 搜素的日期选择器
            pickerOptionsSearch: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            },


            currentPage: 1,          // 当前页码
            pageSizes: [5, 10, 50, 100], // 每页显示条数
            pageSize: 5,             // 每页显示条数
            total: 0,                // 评论总数


        }
    },
    mounted() {
        this.loadAllUser()
        this.loadAllProduct()
        this.searchByManyConditionNoMsg()
        console.log(this.commentList)

    },
    methods: {
        // 输入建议的查询函数
        querySearchUserName(queryString, cb) {
            var restaurants = this.userRestaurants;
            var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
            // 调用 callback 返回建议列表的数据
            cb(results);
        },
        createFilter(queryString) {
            return (restaurant) => {
                return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
            };
        },
        // 带搜索建议的输入框被选中后的响应函数
        handleSelectUser(item) {
            // console.log(item);
            this.searchUserId = item.id
        },
        querySearchStoreName(queryString, cb) {
            var restaurants = this.productRestaurants;
            var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
            // 调用 callback 返回建议列表的数据
            cb(results);
        },
        // 带搜索建议的输入框被选中后的响应函数
        handleSelectStore(item) {
            // console.log(item);
            this.searchProductId = item.id
        },
        // 解决elementUI中时间选择器的问题，使得时间选择器可以清空
        handleDateChange(value) {
            // 当日期改变时的处理函数
            // 在这里你可以根据需要处理日期的值
            // 例如，如果不想让清空操作将日期设置为null，可以在这里进行判断
            if (value === null) {
                // 当清空日期时，不更新pickedDate，保持原值
                // 如果需要在清空时设置日期为特定值（比如空字符串），可以在此处设置
                this.searchCreateTime = ''
                return;
            }
            // 在其他情况下，将值更新为选择的日期
            this.searchCreateTime = value;
        },

        // 搜索
        searchByManyCondition() {
            // 处理时间段信息
            if (this.searchCreateTime !== '' && this.searchCreateTime !== null) {
                this.searchStartTime = dateUtil.formatDate(this.searchCreateTime[0])
                this.searchEndTime = dateUtil.formatDate(this.searchCreateTime[1])
            }
            // else {
            //     this.searchStartTime = '1000-01-01 00:00:00'
            //     this.searchEndTime = '9999-12-31 23:59:59'
            // }
            let comment = {}
            comment.content = this.searchContent
            comment.userId = this.searchUserId
            comment.productId = this.searchProductId
            comment.startTime = this.searchStartTime
            comment.endTime = this.searchEndTime
            let obj = {}
            obj.comment = comment
            obj.currentPage = this.currentPage
            obj.pageSize = this.pageSize
            this.$request.post('/comment/selectInPage', obj).then(res => {
                if (res.code === '200') {
                    this.commentList = res.data.list
                    this.total = res.data.total
                    this.$message.success('查询成功')
                } else {
                    this.$message
                        .error('查询失败')
                }
            })

        },
        searchByManyConditionNoMsg() {
            // 处理时间段信息
            if (this.searchCreateTime !== '' && this.searchCreateTime !== null) {
                this.searchStartTime = dateUtil.formatDate(this.searchCreateTime[0])
                this.searchEndTime = dateUtil.formatDate(this.searchCreateTime[1])
            }
            // else {
            //     this.searchStartTime = '1000-01-01 00:00:00'
            //     this.searchEndTime = '9999-12-31 23:59:59'
            // }
            let comment = {}
            comment.content = this.searchContent
            comment.userId = this.searchUserId
            comment.productId = this.searchProductId
            comment.startTime = this.searchStartTime
            comment.endTime = this.searchEndTime

            let obj = {}
            obj.comment = comment
            obj.currentPage = this.currentPage
            obj.pageSize = this.pageSize

            this.$request.post('/comment/selectInPage', obj).then(res => {
                if (res.code === '200') {
                    this.commentList = res.data.list
                    this.total = res.data.total
                }
            })

        },

        // 重置搜索
        resetCondition() {
            this.searchContent = ''
            this.searchUsername = ''
            this.searchUserId = ''
            this.searchProductName = ''
            this.searchProductId = ''
            this.searchCreateTime = ''
            this.searchByManyConditionNoMsg()
            this.$message.success('重置成功')
        },

        // 加载所有的用户
        loadAllUser() {
            this.$request.get('/user/loadAllUser').then(res => {
                if (res.code === '200') {
                    this.userRestaurants = res.data;
                    // 遍历restaurants,让this.restaurants中的数据格式化name参数变为value
                    this.userRestaurants.forEach((restaurant) => {
                        restaurant.value = restaurant.name;
                        // delete restaurant.name;
                    });
                } else {
                    this.$message.error(res.msg);
                }
            })
        },
        // 加载所有的商品
        loadAllProduct() {
            this.$request.get('/product/selectAll').then(res => {
                if (res.code === '200') {
                    this.productRestaurants = res.data;
                    // 遍历restaurants,让this.restaurants中的数据格式化name参数变为value
                    this.productRestaurants.forEach((restaurant) => {
                        restaurant.value = restaurant.name;
                        // delete restaurant.name;
                    });
                } else {
                    this.$message.error(res.msg);
                }
            })
        },

        // currentPage 改变时会触发
        handleCurrentChange(val) {
            // 获取  当前页 和 页面大小  currentPage、pageSize
            this.currentPage = val;

            // 发送请求获取相应数量的数据
            this.searchByManyConditionNoMsg()
        },

        //  pageSize 改变时会触发
        handleSizeChange(val) {
            // 获取  当前页 和 页面大小  currentPage、pageSize
            this.pageSize = val;
            this.currentPage = 1;

            // 发送请求获取相应数量的数据
            this.searchByManyConditionNoMsg()
        },

        // 删除选中二次提醒
        deleteSelectComments() {
            // 显示二次提醒弹窗
            this.dialogVisible_deleteSelect = true;
        },

        // 查询所有评论
        selectAll() {
            this.resetCondition()
        },

        // 删除选中二次确认
        handleDeleteComments() {
            this.dialogVisible_deleteSelect = false;

            if (this.commentDeletes.length > 0) {
                // 删除选中
                this.$request.post('/comment/deleteList', this.commentDeletes).then(res => {
                    if (res.code === '200') {
                        this.$message.success('删除成功');
                        // 刷新数据
                        this.searchByManyConditionNoMsg()
                    } else {
                        this.$message.error(res.msg);
                    }
                })
            } else {
                this.$message.info('请选择要删除的评论');
            }
        },

        // 并存储到 commentDeletes 数组中
        handleSelectCodeForTicket(val) {
            this.commentDeletes = val
        },

        // 删除按钮二次提醒
        handleDeleteButton(comment) {
            this.dialogVisible_delete = true
            this.commentDelete = comment
        },

        // 删除当前评论
        handleDeleteComment() {
            this.dialogVisible_delete = false;
            this.$request.post('/comment/delete', this.commentDelete).then(res => {
                if (res.code === '200') {
                    this.$message.success('删除成功');
                    this.commentDelete = {}
                    // 重新加载数据
                    this.searchByManyConditionNoMsg()
                } else {
                    this.$message.error(res.msg);
                }
            })
        },
    }
})
</script>


<style scoped>

</style>